<template>
	<div class="statement">
		<el-tabs v-model="activeName">
			<el-tab-pane label="收益" name="1">
				<earning />
			</el-tab-pane>
			<el-tab-pane label="储能" name="2">
				<chuneng />
			</el-tab-pane>
			<!-- <el-tab-pane label="光伏" name="3">
				<guangfu />
			</el-tab-pane> -->
		</el-tabs>
	</div>
</template>
<script>
import chuneng from "./components/chuneng.vue";
import earning from "./components/earning.vue";
import guangfu from "./components/guangfu.vue";
export default {
	name: "brandList",
	components: {
		chuneng,
		guangfu,
		earning,
	},
	data() {
		return {
			activeName: "1",
		};
	},
	created() {},
	methods: {},
};
</script>
<style lang="scss">
.statement {
	height: 100%;
	.el-tabs.el-tabs--top {
		height: 100%;

		.el-tabs__content {
			height: calc(100% - 50px);
			.el-tab-pane {
				height: 100%;
			}
		}
	}
	.el-tabs__header {
		background-color: initial;

		.el-tabs__item {
			border: none;
			text-align: center;
			padding: 0;
			width: 80px;
		}

		.el-tabs__active-bar {
			display: none;
		}

		.el-tabs__item.is-active {
			background: none;
			border: none;
			border-bottom: 2px solid #02faff;
		}
	}
}
</style>
